---
---
<html>

<head>
	<meta charset="utf-8">
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" type="text/css"/>
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css" />
	<title>Jekyll+GitHub API+JS=Dynamic CMS :-)</title>
	<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
	<meta name="viewport" content="width=device-width, initial-scale=1">

	
</head>

<body>
	
	<div class="container" id="container1" >
	<h5>Create new post at {{ site.title }}</h5>
	<div id="messages"></div>
	<form id="theform" method="get">
		<div class="form-group">
			<input type="text" class="form-control" placeholder="Post Title" id="p_title" name="title">
		</div>
		<div class="form-group">
			<textarea class="form-control" rows="10" id="p_body" placeholder="Type your post here." name="body"></textarea>
		</div>
		<div class="form-inline">
			<div class="form-group">
				<label for="username" class="sr-only">Username</label>
				<input type="text" class="form-control" id="username" placeholder="GitHub username">
			</div>
			<div class="form-group">
				<label for="password" class="sr-only">password</label>
				<input type="password" class="form-control" id="password" placeholder="GitHub password">
			</div>
			<input type="button" class="btn btn-default" id="go" value="Post" /> 
			<a class="btn btn-link" data-toggle="collapse" href="#submitform" aria-expanded="false" aria-controls="submitform">Remember username/password</a>
		</div>
		<div class="collapse" id="submitform">
		<br>
	  	<div class="well">
	    	<p>Because of the way this form works (the form data is not sumbitted, as forms usually do), your browser may not ask you to remember the username/password. 
	    	<br>If you'd like to save them to your password manager, fill them in and click this button.
	    	<br>This will not create a new post!</p>
	    	<input type="submit" class="btn btn-default" value="Trick browser to save username/password">
	  	</div>
		</div>
	</form>

	<p>Drag this link to your bookmarks, to post from any webpage: <a href="javascript:(function(){
	var title = document.getElementsByTagName('title')[0].innerHTML;
	title = encodeURIComponent(title) ;
	var selection = '';
	if (window.getSelection) {
	    selection = window.getSelection().toString();
	} else if (document.selection &amp;&amp; document.selection.type != 'Control') {
	    selection = document.selection.createRange().text;
	}
	selection = encodeURIComponent(selection);
	new_window=window.open('{{ "/cms.html" | prepend: site.baseurl | prepend: site.url }}?title='+title+'&amp;selection='+selection+'&amp;url='+encodeURIComponent(document.location.href),'JekyllPopup','resizable,scrollbars,status=0,toolbar=0,menubar=0,titlebar=0,width=640,height=600,location=0');
	})();"
	>post to GitHub</a></p>
	</div>

	<script>
	function get_query(){
		// Source: http://fellowtuts.com/jquery/getting-query-string-values-in-javascript/
	    var url = document.location.href;
	    if (url.indexOf('?') == -1) return false ;
	    var qs = url.substring(url.indexOf('?') + 1).split('&');
	    for(var i = 0, result = {}; i < qs.length; i++){
	        qs[i] = qs[i].split('=');
	        result[qs[i][0]] = decodeURIComponent(qs[i][1].replace(/\+/g, '%20'));
	    }
	    return result;
	}

	function getSelectionText() {
		
		return text;
	}

	function post_file(title) {
		var d = new Date()
		var dd = d.getDate()
		if ( dd < 10 ) dd = '0' + dd ;
		var mm = d.getMonth()+1 ;
		if ( mm < 10 ) mm = '0' + mm ;
		var yyyy = d.getFullYear() ;
		filename = yyyy+'-'+mm+'-'+dd ;
		if (!title) {
			filename = filename + '-' + +d.getTime() ;
		} else {
			var slugified = title.toLowerCase().replace(/\W+/g, '-') ;
			if (slugified!='-') {
				filename = filename + '-' + slugified ;
			} else {
				filename = filename + '-' + d.getTime();
			}
		}
		return filename
	}
	function post_date() {
		var d = new Date()
		return d.toISOString()
	}

	var API_NEW_POST = 'https://api.github.com/repos/{{ site.github_username }}/{{ site.github_username }}.github.io/contents/_posts/' ;

	$("#go").click(function() {
		var user = $('#username').val() ;
		var password = $('#password').val() ;
		var title = $('#p_title').val() ;

		var p_body = '---\n' ;
		p_body = p_body + 'layout: post \n' ;
		p_body = p_body + 'title:  "' + title +'" \n';
		p_body = p_body + 'date:   '+ post_date() +' \n' ;
		/* Setting the category here is not the most elegant way...
		p_body = p_body + 'categories: tests \n'; 
		*/
		p_body = p_body + '---\n';
		p_body = p_body + '\n' + $('#p_body').val();

		var posted_ok = false ;
	    $.ajax({
	        dataType: "json",
	        contentType: 'application/json; charset=UTF-8',
	        url: API_NEW_POST+post_file(title)+'.markdown',
	        type: "PUT",
	        data: JSON.stringify({
	        	content: btoa(unescape(encodeURIComponent(p_body))),
	        	message: 'posted via web' 
	        }),
	        beforeSend: function(xhr) { 
	        	xhr.setRequestHeader("Authorization", "Basic " + btoa(user+":"+password)); 
	    	},
	        success: function(data) {
	        	posted_ok = true ;
	        	$('#container1').html('<h2>Successfully posted to {{ site.title }}</h2') ;
	        },
	        error: function(request, status, error) {
	        	responseText = jQuery.parseJSON( request.responseText );
        		$('#messages').append($('<div class="alert alert-danger alert-dismissible" role="alert">')
        		.append('<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>')
        		.append('<string>' + request.status + '</strong>: ' + responseText.message )
        		.append('</div>'));
	        	
	        },
	      })
	       ;
	});

	query_params = get_query();

	if (query_params) {
		src_body = '';
		if (query_params['title']) {
			src_title = query_params['title'] ;
			$('#p_title').val(src_title) ;
		}
		if (query_params['selection']) {
			src_body = '> ' + query_params['selection'] ;
		}
		if (query_params['body']) {
			src_body = query_params['body'] ;
		}
		if (query_params['url']) {
			src_body = src_body + ' &mdash;['+src_title+'](' + query_params['url'] + ')\n' ;
		}
		$('#p_body').val(src_body) ;
	}

	</script>
</body>
